<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WebGl Solar System</title>
<link rel="css/stylesheet" type="text/css" href="style.css" />
<script src="js/Three.js" type="text/javascript" ></script>
<script>
	var camera,scene,renderer,geometry,material,mesh;	
	function afterLoad(){
		initScene();
		loadCube();
		render();
	}	
	function initScene(){		
		scene=new THREE.Scene();		
		camera=new THREE.PerspectiveCamera(100,(window.innerWidth-20)/(window.innerHeight-20),1,10000);
		camera.position.z = 1000;
		renderer = new THREE.CanvasRenderer();		
		renderer.setSize( window.innerWidth-20, window.innerHeight-20);		
		scene.add(camera);		
		document.body.appendChild(renderer.domElement);
	}	
	function render() {
		requestAnimationFrame(render);
		addRotation();
        renderer.render(scene,camera);
    }	
	function addRotation(){		
		mesh.rotation.x += 0.02;
        mesh.rotation.y += 0.02;		
	}	
	function loadCube(){
		geometry = new THREE.CubeGeometry( 200, 200, 200 );
        material = new THREE.MeshBasicMaterial( { color: 0x00ff00, wireframe: true } );		
		mesh = new THREE.Mesh( geometry, material );		
        scene.add(mesh);
	}
</script>
</head>
<body onload="afterLoad();">
</body>
</html>
